<template>
  <div v-if="article">
    <h2>{{ article.title }}</h2>
    <p>作者：{{ article.author }} 创建于：{{ dayjsFormat(article.createtime).format('YYYY-MM-DD hh:mm:ss') }}</p>
    <hr />
    <p>{{ article.content }}</p>
  </div>
</template>

<script lang="ts">
import { defineComponent, onMounted, computed } from 'vue';
import { useStore } from 'vuex';
import { useRoute } from 'vue-router';
import dayjs from 'dayjs';
export default defineComponent({
  name: 'articleDetail',
  setup() {
    const route = useRoute();
    const store = useStore();
    const id = route.params.id;
    const dayjsFormat = (str: string) => dayjs(str);
    onMounted(() => {
      store.dispatch('fetchArticleDetail', id);
    });
    const article = computed(() => store.getters.getDetails());
    return { article, dayjsFormat };
  }
});
</script>

<style></style>
